.verse {
  @apply flex flex-wrap justify-center transition-all;

  /* 正文 */
  &.body {
    @apply justify-start;

    & + .body {
      @apply mt-6;
    }

    .char {
      @apply mt-4 h-11 w-11 justify-start text-2xl;

      &.symbol {
        @apply w-5 text-left;
      }
    }

    .br {
      @apply hidden;
    }

    button {
      &::before {
        @apply left-[52%];
      }
    }

    &.no-py {
      & + .body {
        @apply mt-4;
      }

      .br {
        ~ .char,
        ~ button .char {
          @apply mt-auto;
        }
      }

      .char {
        @apply h-10 w-auto text-2xl;

        &.tab {
          @apply w-6;
        }
      }
    }
  }

  /* 诗的内容文字 田字格 */
  &.shi {
    .char {
      @apply h-14 w-[3.25rem] text-3xl md:w-12;

      /* 符号 */
      &.symbol {
        @apply w-6 text-left;
      }
    }

    .br {
      ~ .char,
      ~ button .char {
        @apply mt-4 md:mt-0;
      }
    }
  }

  /* 标题 */
  &.title {
    .char {
      @apply h-[4.5rem] text-5xl;

      &.symbol {
        @apply mx-1;
      }

      rt {
        @apply text-lg;
      }
    }

    .br {
      @apply hidden;
    }
  }

  /* 正常 作者 */
  &.normal {
    .char {
      @apply text-xl;

      &.symbol {
        @apply -mx-1 md:mx-1;
      }
    }

    .br {
      @apply !hidden;
    }
  }

  /* 汉字 */
  .char {
    @apply relative flex flex-col-reverse items-center justify-between;

    /* 标注 */
    rt {
      @apply absolute top-0 text-base font-light leading-none text-muted-foreground;
    }
  }

  /* 没有拼音 */
  &.no-py {
    .char {
      @apply w-12;
    }

    .br {
      ~ .char,
      ~ button .char {
        @apply mt-0;
      }
    }
  }

  .br {
    @apply block w-full md:hidden;
  }

  /* 有标注的文字 */
  button {
    @apply relative flex cursor-pointer font-normal text-primary;

    &::before {
      content: "";
      @apply absolute bottom-0 left-1/2 w-10/12 border-b-4 border-double border-primary dark:text-destructive;
      transform: translateX(-50%);
    }
  }
}
